/**
 * jQuery-плагин для декорирования селектов
 *
 *
 * @author Aleksandr Klimenkov
 */

jQuery.fn.slselect = function( aPluginOptions ) {
	
	var aPluginOptions = jQuery.extend({
		"aLang" : { "sCaptionText" : "please, select..." }, 
		"defaultColor" : "#474747",
		"ulClass" : "b-col_left",
		"threeDivs" : false
	}, aPluginOptions)

	var sSelectText = aPluginOptions ["aLang"]["sCaptionText"];

	var oSlSelect = this;

	/**
	 * Получение массива опций
	 */
	this.getNewOptions = function( aOpions ) {

		var aNewOptions = Array();
		/**
		 * получение массива значений
		 */ 
		for (var i = 0; i < aOpions.length; i++ ) {

			var bSelected = false;

			if ( jQuery(aOpions[i]).attr("selected") == true ) {
				bSelected = true;
				sCaptionText = aOpions[i].text;
			}
			
			var oElement = {
						"sValue"	: aOpions[i].value,
						"sName"		: aOpions[i].text,
						"bSelected"	: bSelected
						};
			 aNewOptions[aNewOptions.length] = oElement;
	    }
		
		return aNewOptions;
	}
	
	setCaption = function (sText, o) {
		$( o.parent().find( "div.captionText" ) ).text(sText);
	}
	
	/**
	 * Построение выпадающего списка
	 */
	this.buildOptionsBox = function( aSelectOptions, oOldElement ) {
		//Новый элемент 
		var oNewElement = $(
			!aPluginOptions["threeDivs"] ?
				"<div class='b-lang_select b-text_11 captionText'></div>":
				"<div class='slSelectBox'><div class='leftSide'></div>" +
				"<div class='rightSide'></div>" +
				"<div class='selectContent captionText'>Content</div></div>"
		);
		
		var sCaption = aPluginOptions["aLang"]["sCaptionText"];
		
		//Элемент, содержащий список
		var oBox = $("<div class='b-lang_select_expand'></div>").hide();

		var oBlock = jQuery("<span class='b-top'></span>");
		
		oBlock.append("<span class='b-corner b-tl'><span class='b-corner_img'></span></span>")
				.append("<span class='b-corner b-tr'><span class='b-corner_img'></span></span>")
				.append("<span class='b-filter'></span>")
				.appendTo(oBox);
		
		oBox.append("<span class='b-corner_content'><div class='b-columns'></div></span>");
		
		var oList = jQuery("<ul class='" + aPluginOptions["ulClass"] + "'></ul>");
		var aOptions = $(oOldElement).find("option");
		
		//создание списка
		for (var i = 0; i < aSelectOptions.length; i++ ) {
			
			//var sColor = aOptions.get(i).style.color == "" ? aPluginOptions["defaultColor"] :  aOptions.eq(i).css("color");
			var oLinkElement = jQuery("<a href='#' rel='"+i+"'>" + aSelectOptions[i].sName + "</a>")
								.bind("click", function( ) { return setValue( oNewElement, oOldElement, jQuery(this).attr("rel") ); } );
			
		//	oLinkElement.css( "color", sColor );

			var oLiElement = jQuery("<li></li>")
								.append( oLinkElement )
								.appendTo(oList);
			
			
			if ( aSelectOptions[i].bSelected ) {
				sCaption = aSelectOptions[i].sName;
				//oNewElement.css( "color", sColor );
				oLinkElement.addClass("selected");
			}	
		}
		
		oBox.find(".b-columns").append(oList);
		oBox.find(".b-corner_content").append("<span class='b-filter'></span>");
		
		var oBottom = jQuery("<span  class='b-bot'></span>");
		
		oBottom.append("<span class='b-corner b-bl'><span class='b-corner_img'></span></span>")
				.append("<span class='b-corner b-br'><span class='b-corner_img'></span></span>")
				.append("<span class='b-filter'></span>")
				.appendTo( oBox );
		
		jQuery( oOldElement )
			.hide()
			.after( oNewElement );
		
		setCaption(sCaption, oNewElement);
		
		oNewElement.after( oBox )
		.bind("click", {"oElement" : oBox}, showList );
		
		/**
		 *	Скрытие списка
		 */
		jQuery("body").bind("click", {"oElement" : oBox}, function( oEvent ) { hideList( oEvent.data.oElement ) } );
		
		return jQuery(oOldElement);
	}
	
	
	/**
	 * Выбор значения селекта
	 * 
	 * @param sValue
	 * @return
	 */
	function setValue ( oNewElement, oOldElement, iIndex ) {
	//	var sColor = oOldElement.style.color == "" ? aPluginOptions["defaultColor"] :  oOldElement.css("color");
		
		var aOptions = oSlSelect.getNewOptions( oOldElement.options );
		$(oOldElement)
			.find( "option[value=" + aOptions[iIndex].sValue + "]" )
			.attr("selected","selected")
			.end()
			.change();

		setCaption(aOptions[iIndex].sName, oNewElement);
		
		//oNewElement.css( "color", sColor );
		
		hideList( oNewElement.next() );
		
		return false;
	}
	
	/**
	 * скрытие селекта
	 * @return false
	 */
	function hideList( oElement ) {
		oElement.slideUp();
	}
	
	/**
	 * показ селекта 
	 * @return false
	 */
	function showList( oEvent ) {

		oEvent.data.oElement.slideDown();
		return false;
	}
	
	/**
	 * Построение селектов
	 */
	return this.each( function(){

		var aElementOptions = this.options; 

		return oSlSelect.buildOptionsBox( oSlSelect.getNewOptions( aElementOptions ), this )
		
	})
	
}